<template>
	<el-dialog title="自动组卷" :visible.sync="dialogVisible" width="75%">
		<span>当前试卷：{{paperTitle}}</span>
		<span>试卷题目总数：{{paperNum}}</span>
		<span>试卷题目现有数量：{{currentNum}}</span>
		<!-- 嵌套容器 -->
		<el-container>
			<!-- 侧边导航菜单 -->
			<el-aside width="300px" style="overflow:hidden">
				<el-form :inline="true" :model="dataForm" @keyup.enter.native="getChapterListData()"
					style="margin-top: 20px; margin-left: 10px;margin-right: -10px;">
					<el-form-item>
						<el-input v-model="dataForm.chapterName" placeholder="章节名称" clearable></el-input>
					</el-form-item>
					<el-form-item>
						<el-button @click="getChapterListData()">查询</el-button>
					</el-form-item>
				</el-form>
				<el-table :data="dataList" border style="width: 100%" v-loading="dataListLoading"
					element-loading-text="拼命加载中">
					<el-table-column label="章节名称" prop="name" header-align="center" align="center"
						:show-overflow-tooltip="true">
					</el-table-column>
					<el-table-column label="总数" prop="tnum" header-align="center" align="center">
					</el-table-column>
					<el-table-column fixed="right" label="数量" header-align="center" align="center">
						<template slot-scope="scope">
							<el-input v-model="scope.row.num" @change="checkInputNum(scope.row.num,scope.row.tnum)">
							</el-input>
						</template>
					</el-table-column>
				</el-table>
				<el-pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle"
					:current-page="pageIndex" :page-size="pageSize" :total="totalPage" :pager-count="3"
					layout="total, prev, pager, next">
				</el-pagination>
			</el-aside>
			<!-- 内容 -->
			<el-main>
				<el-table :data="topicList" border style="width: 100%" v-loading="topicListLoading"
					element-loading-text="拼命加载中">
					<el-table-column label="编号" prop="topicId" header-align="center" align="center"
						:show-overflow-tooltip="true">
					</el-table-column>
					<el-table-column label="题目" prop="topicName" header-align="center" align="center"
						:show-overflow-tooltip="true">
					</el-table-column>
					</el-table-column>
					<el-table-column fixed="right" label="操作" header-align="center" align="center">
						<template slot-scope="scope">
							<el-button @click="deleteTopic(scope.row.topicId)" type="danger">删除</el-button>
						</template>
					</el-table-column>
				</el-table>
				<el-pagination @size-change="sizeChangeHandle1" @current-change="currentChangeHandle1"
					:current-page="pageIndex1" :page-size="pageSize1" :total="totalPage1" :pager-count="3"
					layout="total, prev, pager, next">
				</el-pagination>
			</el-main>
		</el-container>
		<span slot="footer" class="dialog-footer">
			<el-button @click="generatePaper()">生成试卷</el-button>
			<el-button @click="dialogVisible = false">取 消</el-button>
			<el-button type="primary" @click="dialogVisible = false">确 定</el-button>
		</span>
	</el-dialog>
</template>
<script>
	export default {
		data() {
			return {
				dataForm: {
					chapterName: '',
				},
				dialogVisible: false,
				dataList: [],
				pageIndex: 1,
				pageSize: 5,
				totalPage: 0,
				// 试卷题目开始
				topicList: [],
				pageIndex1: 1,
				pageSize1: 5,
				totalPage1: 0,
				// 试卷题目结束
				dataListLoading: false,
				topicListLoading: false,
				show: false,
				paperId: 0,
				courseId: 0,
				paperNum: 0,
				paperTitle: '',
				currentNum: 0,
			}
		},
		activated() {

		},
		methods: {
			init(paperId, courseId, paperNum, paperTitle) {
				this.paperId = paperId;
				this.paperNum = paperNum;
				this.paperTitle = paperTitle;
				this.courseId = courseId;
				this.dialogVisible = true;
				this.getChapterListData();
				this.getTopicListByTid();
			},
			/**
			 * 加载章节列表
			 */
			getChapterListData() {
				let _that = this
				this.dataListLoading = true
				this.$http({
					url: this.$http.adornUrl('/chapter/getChapterListByParams'),
					method: 'get',
					params: this.$http.adornParams({
						'id': this.courseId,
						'name': this.dataForm.chapterName,
						'page': this.pageIndex,
						'limit': this.pageSize,
					})
				}).then(({
					data
				}) => {
					_that.dataList = []
					if (data && data.code === 0) {
						_that.dataList = data.data
						_that.totalPage = data.count
					} else {
						_that.dataList = []
						_that.totalPage = 0
					}
					this.dataListLoading = false
				})
			},
			// 每页数
			sizeChangeHandle(val) {
				this.pageSize = val
				this.pageIndex = 1
				this.getChapterListData()
			},
			// 当前页
			currentChangeHandle(val) {
				this.pageIndex = val
				this.getChapterListData()
			},
			/**
			 * @param {Object} id
			 * 加载试卷试题列表
			 */
			getTopicListByTid() {
				let _that = this;
				this.topicListLoading = true;
				this.$http({
					url: this.$http.adornUrl('/sys/paperInfo/getTopicListByTid'),
					method: 'get',
					params: this.$http.adornParams({
						'tid': this.paperId,
						'page': this.pageIndex1,
						'limit': this.pageSize1,
					})
				}).then(({
					data
				}) => {
					_that.topicList = []
					if (data && data.code === 0) {
						_that.topicList = data.data;
						_that.totalPage1 = data.count;
						_that.currentNum = data.count;
					} else {
						_that.topicList = [];
						_that.totalPage1 = 0;
					}
					this.topicListLoading = false;
				})
			},
			// 每页数
			sizeChangeHandle1(val) {
				this.pageSize1 = val
				this.pageIndex1 = 1
				this.getTopicListByTid()
			},
			// 当前页
			currentChangeHandle1(val) {
				this.pageIndex1 = val;
				this.getTopicListByTid()
			},
			/**
			 * 生成试卷
			 */
			generatePaper() {
				this.topicListLoading = true;
				let _that = this;
				/**
				 * 判断当前试卷数量和试卷总数量
				 */
				if (_that.paperNum <= _that.currentNum) {
					_that.$message({
						showClose: true,
						message: '已经不能再添加题目了！！！',
						type: 'warning'
					});
					this.topicListLoading = false;
					return false;
				}
				var objs = new Array();
				var sum = 0;
				for (var i = 0; i < _that.dataList.length; i++) {
					var obj = new Object();
					obj.tid = _that.paperId;
					obj.id = _that.dataList[i].id;
					obj.num = _that.dataList[i].num;
					sum += Number(_that.dataList[i].num == null ? 0 : _that.dataList[i].num);
					objs.push(obj);
				};
				/**
				 * 判断是否能够组卷
				 */
				if (sum == 0) {
					_that.$message({
						showClose: true,
						message: '请在指定位置输入题目数量！！！',
						type: 'warning'
					});
					this.topicListLoading = false;
					return false;
				}
				if (_that.currentNum + sum > _that.paperNum) {
					_that.$message({
						showClose: true,
						message: '将要添加题目数量大于试卷规定数量！！！',
						type: 'warning'
					});
					this.topicListLoading = false;
					return false;
				}
				_that.$http({
					url: _that.$http.adornUrl('/sys/paperInfo/autoPaper'),
					method: 'post',
					data: _that.$http.adornData(objs, false)
				}).then(({
					data
				}) => {
					_that.getTopicListByTid();
				})
			},
			/**
			 * @param {Object} inum
			 * @param {Object} tnum
			 * 判断输入数量是否大于章节下题目数量
			 *  有个bug没有解决，无法回显
			 */
			checkInputNum(inum, tnum) {
				if (inum > tnum) {
					this.$message({
						showClose: true,
						message: '输入数量大于章节下题目总数！！！',
						type: 'warning'
					});
					return false;
				}
			},
			/**
			 * @param {Object} id
			 * 从试卷中删除该题目
			 */
			deleteTopic(id) {
				this.$http({
					url: this.$http.adornUrl('/sys/paperInfo/delPaperInfo'),
					method: 'get',
					params: this.$http.adornParams({
						'tid': this.paperId,
						'id': id,
					})
				}).then(({
					data
				}) => {
					this.getTopicListByTid();
				})
			}
		}
	};
</script>
<style>
	.el-container {
		border: 1px solid #000000;
	}

	.el-aside {
		border-right: #000000 1px solid;
	}
</style>
